<!DOCTYPE html>
<html lang="en-us">

  {% include head.html %}

  <body class="theme-base-{{site.color-scheme}}">

    <!-- This if statement decides which sidebar to use -->
    {% if page.toc %}
    {% include sidebar-toc.html %}
    {% else %}
    {% include sidebar.html %}
    {% endif %}

    <!--
      Wrap is the content to shift when toggling the sidebar. We wrap the content to avoid any CSS
      collisions with our real content.
    -->
    <div class="wrap">
      <header class="masthead">
        <div class="container">
          <h3 class="masthead-title">
            <a href="{{ site.baseurl }}/" title="Home">{{ site.title | newline_to_br }}</a>
            <br><small>{{ site.tagline }}</small>
          </h3>
        </div>
      </header>

      <main class="container content" id="main">
        {{ content }}
      </main>
    </div>

    <label for="sidebar-checkbox" class="sidebar-toggle"></label>

    <script>

    // Highlight search Query
    var url = window.location.href;
      if (url.lastIndexOf("?q=") > 0) {
        // get the index of the parameter, add three (to account for length)
        var stringloc = url.lastIndexOf("?q=") + 3;
        // get the substring (query) and decode
        var searchquery = decodeURIComponent(url.substr(stringloc));
        // regex matches at beginning of line, end of line or word boundary, useful for poetry
        var regex = new RegExp("(?:^|\\b)(" + searchquery + ")(?:$|\\b)", "gim");
        // get, add mark and then set content
        var content = document.getElementById("main").innerHTML;
        document.getElementById("main").innerHTML = content.replace(regex, "<mark>$1</mark>");
      }

      // Toggle sidebar
      (function(document) {
        var toggle = document.querySelector('.sidebar-toggle');
        var sidebar = document.querySelector('#sidebar');
        var checkbox = document.querySelector('#sidebar-checkbox');

        document.addEventListener('click', function(e) {
          var target = e.target;

          if(!checkbox.checked ||
             !sidebar.contains(target) ||
             (target === checkbox || target === toggle)) return;

          checkbox.checked = false;
        }, false);
      })(document);
    </script>

<!-- Facebook SDK for JavaScript -->
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : '589495744558280',
      xfbml      : true,
      version    : 'v2.6'
    });
  };

  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
  </body>
</html>
